import React, { FC, useEffect, useState } from 'react'
import noDataUrl from '@/assets/images/common_empty.png'
import { useNavigate } from 'react-router-dom'
import { OperateInfo, OrderInfo } from '@/types/orderList/orderDetail'
import { cannelPay } from '@/api/orderConfirm'
import confirm from '../home/confirm'
import { BalanceValue, XBusinesslineId } from '@/constants'
import { Toast } from 'antd-mobile'
import { useAppDispatch, useAppSelector } from '@/store'
import { selectPayParam, setPayParam, setPayPrice, setStartPayTime } from '@/store/payCenter'
import { EOperateStatus, EPayCode } from '@/types/enum'
import { EPaySimpleCode } from '@/types/payCenter'
const emptyOrder: FC<{ operateInfo: OperateInfo; orderInfo: OrderInfo }> = (props) => {
  const navigate = useNavigate()
  const dispatch = useAppDispatch()
  const select = useAppSelector(selectPayParam)
  useEffect(() => {
    if (props.operateInfo.operateStatus === EOperateStatus.payment) {
      dispatch(setPayPrice(props.orderInfo.realPrice.toString()))
      dispatch(setStartPayTime(+new Date(props.orderInfo.createTime)))
      dispatch(
        setPayParam({
          payCode: EPaySimpleCode.WEIXIN,
          isUseBalance: BalanceValue,
          orderNum: props.orderInfo.orderNum,
        }),
      )
    }
  }, [])

  //to do  添加支付参数，添加支付时间

  return (
    <div className="w-full fixed bottom-0  h-r5.6  bg-white">
      <div className=" h-r6.0 pl-r4.6 pr-r4.6 pt-r0.9 pb-r1.0 leading-r6.0 overflow-hidden">
        <span
          className=" float-left   text-r1.4 h-r4.0 w-r11.0   -top-r1.0 shadow-bs2  leading-r4.0   text-gray-333333 font-normal rounded-r2.0  bg-gray-999999 bg-opacity-10 inline-block text-center "
          onClick={() => {
            confirm(
              '是否确定取消订单',
              async () => {
                const res = await cannelPay({
                  orderNum: props.orderInfo.orderNum,
                  'X-Businessline-Id': XBusinesslineId,
                })
                Toast.show({
                  content: res.data,
                })
                if (res.status === 1) {
                  navigate(-1)
                }
              },
              () => {},
            )
          }}
        >
          取消订单
        </span>
        <span
          className=" float-right  text-r1.4 h-r4.0 w-r11.0  text-white leading-r4.0 rounded-r2.0  bg-gradient-to-r from-orange-FF664F to-orange-FF3627  inline-block text-center "
          onClick={() => {
            window.location.replace(props.operateInfo.operateHref)
          }}
        >
          立即支付
        </span>
      </div>
    </div>
  )
}

export default emptyOrder
